<template>
	<view>
		<view class="zy-text-black-lg-bold zy-mb">Oct 22</view>
		<view class="zy-bg-white-r30 zy-p-lg zy-mb-lg">
			<!-- 图片，标题，数量，价格等等 -->
			<view class="zy-row">
				<image :src="getTestImage()" style="width: 200rpx; height: 200rpx; border-radius: 15rpx;"
					mode="aspectFill"></image>
				<view class="zy-flex-width zy-ml">
					<view class="zy-text-black-lg zy-text-line2">Huawei Mate 10 Porsche Design Factory Unlock…</view>
					<view class="zy-text-gray-light-lg-bold zy-mt-sm">x1</view>
					<view class="zy-row-between zy-mt-sm">
						<view class="zy-text-black-sm">Unpaid amount:</view>
						<view class="zy-row">
							<view class="zy-text-black">₱</view>
							<view class="zy-text-black-lg">10.00</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 两个价格 -->
			<view class="zy-bg-yellow-light-r15 zy-ph-lg zy-pv zy-mt">
				<view class="zy-row-between">
					<view>
						<view class="zy-text-black-lg">Rectangle 139</view>
						<view class="zy-text-black-lg-bold" :class="{'zy-text-gray-light-lg-bold': disable}">14</view>
					</view>
					<view class="zy-column-right">
						<view class="zy-text-black-lg">Subsidies</view>
						<view class="zy-row">
							<view class="zy-text-main-lg-bold" :class="{'zy-text-gray-light-lg-bold': disable}">₱</view>
							<view class="zy-text-main-lg-super-bold" :class="{'zy-text-gray-light-lg-super-bold': disable}">1999</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 提示 -->
			<view class="zy-row-center zy-text-main-sm zy-mt" style="text-align: center;">27/10/2024 10:00:00
				Announching the resuits resuitsthe resuits of the snap-up</view>
			<!-- 时间 -->
			<view class="zy-row-center  zy-mt zy-text-black-lg-super" style="font-weight: 400;">21:58:47</view>
			<!-- 按钮 -->
			<zy-button class="zy-mt-lg" content="Receive principal and subsidies" :color="disable? 'gray': ''"></zy-button>
		</view>

	</view>
</template>

<script>
	export default {
		name: "order-item",
		data() {
			return {

			};
		},
		props: {
			disable: {
				type: Boolean,
				default: () => false
			}
		}
	}
</script>

<style>

</style>